<template>
	<view class="mian">
		<!-- #ifdef MP-WEIXIN -->
			<navbar :bgColor="bgColor" :btnColors='btnColor' title="快递信息" :isGoBack="true" :isNotice="true" :visible="true"></navbar>
		<!-- #endif -->	
		
		<view class="goods_info">
			<view class="">
				<image :src="newlist.lists.order_goods.goods_logo" mode="aspectFill" class="goods_image"></image>
			</view> 
			<view class="flex flex-direction justify-between ml-20">
				<view class="flex">
					<text style="font-weight: 600;color: #999; font-size: 28rpx;">物流状态</text>
					<text class="ml-15" style="font-weight: 600;color: #000; font-size: 28rpx;">{{newlist.lists.status==4?'发货中':'已完成'}}</text>
				</view>
				<text style="font-weight: 400;color: #999; font-size: 28rpx;">快递公司：{{newlist.lists.express_title}}</text>
				<view class="flex align-center text-center">
					<text style="font-weight: 400;color: #999; font-size: 28rpx;">快递单号：</text>
					<text  style="font-weight: 400;color: #000; font-size: 28rpx;" class="mr-10">{{newlist.lists.express_code}}</text>
					<text style="color: #518FA0 ;" @click="copy(newlist.lists.express_code)">复制 </text>					
				</view>				
			</view>
		</view>
		
		
		<view class="kq">
			<view class="">
				<text>物流信息</text>
			</view>
			<view class="mt-30">
				<u-empty mode="data" v-if="!newlist.lists.order_exp"></u-empty>
				<u-steps current="0" direction="column"  dot v-if="newlist.lists.order_exp">
					<u-steps-item :title="item.text" :desc="item.ftime" class="mt-30" v-for="(item,index) in newlist.lists.order_exp"></u-steps-item>
				</u-steps>
			</view>
			
		</view>
	</view>
</template>

<style>
	.goods_info{
		display: flex;
		background-color: #FFFFFF;
		padding-left: 30rpx;
		padding-top: 30rpx;
		padding-bottom: 30rpx;
		font-size: 28rpx;
	}
	.goods_image{
		width: 154rpx;
		height: 144rpx;
		background: #FFFFFF;
		border-radius: 20rpx 20rpx 20rpx 20rpx;
	}
	.u-text{
		width: 86% !important;
	}
	.kq{
		display: flex;
		margin-top: 20rpx;
		flex-direction: column;
		padding-top: 20rpx;
		padding-left: 40rpx;
		padding-right:20rpx;
		background-color: #fff;
	}
	.u-text__value{
		color:#518FA0 !important;
		font-size: 25rpx;
		margin-top: 15rpx;
	}
	.u-text__value--tips{
		margin-left: 5rpx;
		margin-top: 10rpx;
		color:#518FA0 !important;
	}
	
</style>

<script>
	export default {
		 	data() {
		 		return {
					...getApp().globalData.config,
					orderId:'',
					newlist:[]
					
				}
			},
			onLoad(options) {
				if(options.orderId){
					this.orderId=options.orderId
				}			
			},
			onShow() {
				this.queryorder()
			},
			methods:{			
				queryorder(type){
				     let obj_data={
				        orderId:this.orderId
				     }
				     this.$http.queryorders(obj_data).then(res=>{
				        if(res.resCode=='9999'){
							this.newlist=res.data
				        }
				     })
				},
			}
		}
</script>